<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/1/22
  Time: 21:19
  To change this template use File | Settings | File Templates.
--%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <script src="../../js/jquery.min.3.1.0.js"></script>
    <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
    <script src="../../layuiadmin/layui/layui.js" charset="utf-8"></script>
</head>
<body>

<style>

</style>
<%--<input type="hidden" value="123" id="goodname">--%>

<form id="insert" class="layui-form" action="/InsertOrderServlet" lay-filter="example" method="post">
    <table class="layui-hide" id="test"></table>
    <div class="layui-form-item" style="display: none">
        <div class="layui-input-block" >
            <input type="hidden" id="id" name="id" lay-verify="fname" value="${order.orderId}" autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item" style="display: none">
        <div class="layui-input-block">
            <input id="wareId" name="wareId" value="${order.wareId}" type="hidden">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">用户账号</label>
        <div class="layui-input-block">
            <select name="consumerId">
                  <c:forEach var="u" items="${userList}">
                      <option value="${u.uID}">${u.uAccount}</option>
                  </c:forEach>
              </select>
        </div>
    </div>

    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">选择商品</label>
        <div class="layui-input-block">
            <input readonly type="text" id="wareName" name="wareName" lay-verify="wareName"
                   value="${order.wareName}"  placeholder="点击选择商品" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">订单总价</label>
        <div class="layui-input-block">
            <input type="text" readonly name="price" id="price" value="${order.orderPrice}" lay-verify="price" autocomplete="off"
                   class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">订单状态</label>
        <div  class="layui-input-block">
            <select name="state" class="layui-input  layui-select">
                <option value="0" <c:if test="${order.orderState==0}">selected="selected"</c:if>>已完成</option>
                <option value="1" <c:if test="${order.orderState==1}">selected="selected"</c:if>>待付款</option>
                <option value="2" <c:if test="${order.orderState==2}">selected="selected"</c:if>>待发货</option>
                <option value="3" <c:if test="${order.orderState==3}">selected="selected"</c:if>>待收货</option>
                <option value="4" <c:if test="${order.orderState==4}">selected="selected"</c:if>>待评论</option>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">订单备注</label>
        <div class="layui-input-block">
            <input type="text" name="remark" value="${order.orderRemarks}" lay-verify="remark" autocomplete="off"
                   class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">订单地址</label>
        <div class="layui-input-block">
            <input type="text" name="address" value="${order.orderAddress}" lay-verify="address" autocomplete="off"
                   class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">订单时间</label>
        <div class="layui-input-block">
            <input type="text" name="time" lay-verify="time" class="layui-input" id="test1" value="${order.orderDate}">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>

<script>
    layui.use(['form', 'layedit', 'laydate'], function () {
        var form = layui.form
            , layer = layui.layer
            , layedit = layui.layedit
            , laydate = layui.laydate;

        //日期
        laydate.render({
            elem: '#test1'
            , type: 'datetime'
        });
        //创建一个编辑器
        var editIndex = layedit.build('LAY_demo_editor');

        //验证新增订单页面的输入框
        form.verify({
             address:function (value) {
                if (!/[\u4e00-\u9fa5]+/.test(value)) {
                    return '订单地址必须包含文字';
                }
            }
            ,time:function (value) {
                if (value.length<1) {
                    return '必须选择订单时间';
                }
            }
            ,wareName:function (value) {
                if (value.length<1) {
                    return '请选择商品';
                }
            }

        });
        //监听提交
        form.on('submit(demo1)', function (data) {
            $.ajax({
                type: "POST",
                url: "../../InsertOrderServlet",
                data: $('#insert').serialize(),// 序列化表单值
                async: false,
                success: function (data) {
                    alert(data.msg);
                    var index = parent.layer.getFrameIndex(window.name);
                    parent.layer.close(index);
                }
            });
            return false;
        })
    })
</script>
<script>
    $(function () {
        $("#wareName").click(function () {
            layer.open({   //打开一个弹出层
                title: '选择商品',   //弹出层的标题
                maxmin: true,
                type: 2,
                content: 'jsp/hwy/SeleWare.jsp', //要访问的地址
                area: ['700px', '550px'],
                end: function () { //表示弹出层关闭的时候的代码块

                }
            });
        })
    })
</script>
</body>
</html>

